(function($){

/// 幻灯片播放组件
/// @param {Array,HTMLCollection} 轮换内容
/// @param {Array,HTMLCollection} 控制标签
/// @param {Object} 组件参数
$.Tab = function(contents, tabs, options) {
	var t = this, options = options || { };
	
	for (var i in $.Tab.options) {
	    if (!options[i]) {
	        options[i] = $.Tab.options[i];
	    }
	}
	t.options = options;
	
	t._total = contents.length;
	t._contents = contents;
	t._curSelected = options.curSelected != null ? options.curSelected : -1;
	t._tabs = tabs;
	
	contents.each(function(el, i) {
		$(this)[i == t._curSelected ? "addClass" : "removeClass"](options.selectedClass);
	});
	
	tabs.each(function(el, i) {
		$(this)[i == t._curSelected ? "addClass" : "removeClass"](options.selectedClass)
			.on(options.selectWhen, function(e) {
				t.select(i, e);
			});
	});
};

$.extend($.Tab.prototype, {
	select : function(i, e) {
		var t = this, options = t.options;
		
		t.onSelect && t.onSelect(i, e);
		
		t._contents.each(function(el, j) {
			$(this)[j == i ? "addClass" : "removeClass"](options.selectedClass);
		});
		t._tabs.each(function(el, j) {
			$(this)[j == i ? "addClass" : "removeClass"](options.selectedClass);
		});

		t._finishSelecting(i);
	},
	
	current : function() { return this._curSelected; },

	_finishSelecting : function(i) {
		var t = this;
		if (i != null && t._curSelected != i) {
			t.afterSelect && t.afterSelect(i, t._curSelected);
			t._curSelected = i;
		}
	}
});

$.Tab.options = {
	selectedClass : "current",
	selectWhen : "click"
};

// 可滚动元素
$.Nodes.prototype.scroll = function(options){
	this.each(function(node){
		node.scroll = node.scroll || new Scroll(node, options);
	});
	return this;
}

var	getEventPos = isTouch ? function(e, axis){
	return e.targetTouches[0]["page" + axis];
}: function(e, axis){
	return e["page" + axis]
};

function Scroll(node, options){
	var t = this, op = t.options = $.extend({
		startWhen: isTouch ? "touchstart" : "mousedown",
		endWhen: isTouch ? "touchend" : "mouseup",
		moveWhen: isTouch ? "touchmove" : "mousemove",
		duration: node.style.webkitTransitionDuration || "500ms",
		scrollX: false,
		scrollY: true
	}, options || {});

	t.x = t.y = 0;
	t.node = node;
	try{
		var parent = node.parentNode;
		t.rangeX = node.scrollWidth - node.clientWidth;
		t.rangeY = node.scrollHeight - node.clientWidth;
		console.log("|" + $(node).height() + '-' + $(node.parentNode).height());
	}catch(e){
		alert(e);
	}
	var startX, startY, dx, dy, touched = false, moved = false, time, target;
	$(node).on(op.startWhen, function(e){
		t.node.style.webkitTransitionDuration = '0';
		touched = true;
		time = e.timeStamp;
		dy = dx = 0;
		startX = getEventPos(e, "X");
		startY = getEventPos(e, "Y");
		
		e.preventDefault();
		target = e.target;
		moved = false;
	}).on(op.moveWhen, function(e){
		moved = true;
		if(!touched || e.timeStamp - time < 50)	return;	// 滑动灵敏度
		time = e.timeStamp;
		
		
		var newX = getEventPos(e, "X"), newY = getEventPos(e, "Y");
		dx = newX - startX;
		dy = newY - startY;
		startX = newX;
		startY = newY;
		if(op.scrollY && t.rangeY > 0 && t.y + dy + t.rangeY >= 0 && t.y + dy <= 0){
			t.setY(t.y + dy);
		}
		if(op.scrollX && t.rangeX > 0 && t.x + dx + t.rangeX >= 0 && t.x + dx <= 0){
			t.setX(t.x + dx);
		}
	}).on(op.endWhen, function(e){
		touched = false;
		if(!moved){
			ev = document.createEvent('MouseEvents');
			ev.initMouseEvent('click', true, true, e.view, 1,
				0, 0, t.x, t.y,
				e.ctrlKey, e.altKey, e.shiftKey, e.metaKey,
				0, null);
			target.dispatchEvent(ev);
		}
		dy = dy * 2;	// 可设置缓动距离
		t.node.style.webkitTransitionDuration = op.duration;
		op.scrollX && t.setX(t.x + dx + t.rangeX < 0 ? (-t.rangeX) : t.x + dx > 0 ? 0 : t.x + dx);
		op.scrollY && t.setY(t.y + dy + t.rangeY < 0 ? (-t.rangeY) : t.y + dy > 0 ? 0 : t.y + dy);
		return false;
	})/* TODO Transition end */;
}

Scroll.prototype.setX = function (x){
	var t = this;
	t.node.style.marginLeft = x + "px";
	t.x = x;
}
Scroll.prototype.setY = function (y){
	var t = this;
	t.node.style.marginTop = y + "px";
	t.y = y;
}
Scroll.prototype.refresh = function(){
	var t = this, node = t.node;
	t.rangeX = $(node).width() - $(node.parentNode).width();
	t.rangeY = $(node).height() - $(node.parentNode).height();
	t.options.scrollX && t.setX(t.x + t.rangeX < 0 ? (-t.rangeX) : t.x > 0 ? 0 : t.x);
	t.options.scrollY && t.setY(t.y + t.rangeY < 0 ? (-t.rangeY) : t.y > 0 ? 0 : t.y);
}

})(window.$);